<template>
	<!--手机、微信一键绑定-->
	<view class="login-box">
		<view class="new_bg">
			<view class="tip_box">授权提醒</view>
			<view class="content_box">
				请授权头像、手机号码等信息，以便为您提供更好的服务
			</view>
			<view class="agree">
				<view class="text_box">
					<checkbox @click="isShow = !isShow" color="#ff4d4d" style="transform:scale(0.7)"
						class="tick_icon_box" value="cb" :checked="iconShow" />
					<text style="color: #999999">已阅读并同意</text>
					<text class="fontColor-primary" @click="navTo('1')">《隐私保护政策》</text>
					<text class="fontColor-primary" @click="navTo('2')">《用户登录协议》</text>
				</view>
			</view>
			<!-- #ifdef MP -->
			<button v-if="isShow" open-type="getUserInfo" class="new-confirm-btn" @getuserinfo="showAuthModal"
				hover-class="hoverBtn">立即授权</button>
			<button :disabled="!isShow" v-if="bindPhoNumSta===1" class='wxbottom' type='primary' open-type="getPhoneNumber"
				@getphonenumber="getPhoneNumber">微信用户一键授权</button>
			<button :disabled="!isShow" v-else-if="bindPhoNumSta===2" class='wxbottom' type='primary' @click="toLogin">微信用户一键授权</button>
			<!-- #endif -->
			<button class="new-close-btn" @click="cancelAuth" hover-class="hoverBtn">再想想</button>

		</view>
	</view>
</template>

<script>
	import store from '@/store'
	//import { editUserInfo, userLogin } from '../../common/api.js';
	import {
		userLogin,
		decrypt_datas,
		insertopenids,
		initbindmobiles,
		getuserinfos
	} from '../../common/api.js';
	import api from '@/common/util.js'
	import {
		mapState,
		mapMutations
	} from "vuex";
	var app = require('@/common/common.js'); //引入公共方法
	export default {
		data() {
			return {
				isShow: true,
				user: '',
				iconShow: true,
				type: '',
				item: '',
				userInfos: {
					user_name: '',
					province: '',
					city: '',
					country: '',
					headimgurl: '',
					openid: '',
					session_key: '',
					phoneNumber: ''
				},
				bindPhoNumSta:''
			}
		},
		onLoad(option) {
			console.log(333, option)
			this.type = option.type;
			if (option.data) {
				let item = JSON.parse(option.data);
				this.item = item;
			}
			this.user = option.from || ''
			this.showAuthModal();
		},
		computed: {
			...mapState(['share_id', 'openid', 'agent_id', 'userInfo']),
		},
		methods: {
			...mapMutations(['setLogin', 'setloginStatus', 'setUserInfo', 'login']),
			unAuthModal() {
				uni.showToast({
					title: '请阅读相关协议',
					duration: 2000,
					icon: "none"
				})
			},
			//已经绑定过用户登录
			toLogin(){
				let _self = this;
				//设置缓存
				_self.setUserInfo({
					user_name: _self.userInfos.user_name,
					province: _self.userInfos.province,
					city: _self.userInfos.city,
					country: _self.userInfos.country,
					headimgurl: _self.userInfos.headimgurl,
					openid: _self.userInfos.openid,
					session_key: _self.userInfos.session_key,
					phoneNumber: _self.userInfos.phoneNumber,
				});
				uni.setStorageSync('userInfo', _self.userInfos);
				_self.setLogin(_self.userInfos.openid)
				uni.setStorageSync('super_token', _self.userInfos
					.openid);
				_self.setloginStatus(true)
				if (_self.user === 'user') {
					// 登录成功后跳转的地址
					uni.switchTab({
						url: '/pages/user/index'
					});
				} else {
					// 登录成功后跳转的地址
					uni.navigateTo({
						url: '/pages/index/race_detail?from=index&type=' +
							_self
							.type + '&data=' + JSON.stringify(
								_self.item)
					})
				}
			},
			//未绑定手机用户
			getPhoneNumber(e) {
				console.log(1234, e)
				let _self = this;
				//uni.setStorageSync('isCanUse', false);//记录是否第一次授权 false:表示不是第一次授权
				let dataform = {
					session_key: '',
					encrypted_data: '',
					iv: ''
				}
				dataform.encrypted_data = e.detail.encryptedData;
				dataform.iv = e.detail.iv;
				dataform.session_key = _self.userInfos.session_key;
				//使用encryptedData获取信息
				decrypt_datas(dataform).then(res => {
					if (res.code === 2000) {
						let resdata = JSON.parse(res.data)
						//初始绑定手机号
						initbindmobiles({
							mobile: resdata.phoneNumber,
							openid: _self.userInfos.openid
						}).then(res2 => {
							console.log(999, res2)
							if (res2.code === 2000) {
								_self.userInfos.phoneNumber = resdata.phoneNumber
								//设置缓存
								_self.setUserInfo({
									user_name: _self.userInfos.user_name,
									province: _self.userInfos.province,
									city: _self.userInfos.city,
									country: _self.userInfos.country,
									headimgurl: _self.userInfos.headimgurl,
									openid: _self.userInfos.openid,
									session_key: _self.userInfos.session_key,
									phoneNumber: _self.userInfos.phoneNumber,
								});
								uni.setStorageSync('userInfo', _self.userInfos);
								_self.setLogin(_self.userInfos.openid)
								uni.setStorageSync('super_token', _self.userInfos
									.openid);
								_self.setloginStatus(true)
								if (_self.user === 'user') {
									// 登录成功后跳转的地址
									uni.switchTab({
										url: '/pages/user/index'
									});
								} else {
									// 登录成功后跳转的地址
									uni.navigateTo({
										url: '/pages/index/race_detail?from=index&type=' +
											_self
											.type + '&data=' + JSON.stringify(
												_self.item)
									})
								}
							} else if (res2.code === 3002) {
								uni.showToast({
									title: res2.msg,
									duration: 2000,
									icon: "none"
								});
							}
						})
				
					}
				})
			},
			// 授权判断
			showAuthModal(res) {
				const _self = this;
				// #ifdef MP-WEIXIN
				if (app.is_iOS()) {
					//iOS的方法
					uni.login({
						provider: 'apple',
						success(loginRes) {
							console.log('登陆成功', loginRes)
							const {
								code
							} = loginRes
							userLogin({
								code
							}).then(({
								data
							}) => {
								const {
									openid
								} = data;
								//赋值
								_self.userInfos.openid = openid;
								_self.userInfos.session_key = data.session_key;

								uni.getUserInfo({
									provider: 'apple', //iOS的方法
									success: function(resdata) {
										//赋值
										_self.userInfos.user_name = resdata.userInfo.nickName
										_self.userInfos.headimgurl = resdata.userInfo.avatarUrl

										resdata.userInfo.openid = data.openid;
										insertopenids({
											data: JSON.stringify(resdata.userInfo)
										}).then(res3 => {
											console.log(888, res3)
											//判断用户是否绑定过手机
											getuserinfos({
												openid: _self.userInfos.openid
											}).then(result => {
												console.log(456, result)
												if (result.code === 2000) {
													_self.bindPhoNumSta = result.data.mobile_init
													_self.userInfos.phoneNumber = result.data.mobile
												}
											})
										})
									}
								})
							})
						},
						fail(e) {
							console.log('errer->', e)
						}
					});
				} else {
					uni.login({
						provider: 'weixin',
						success(loginRes) {
							console.log('登陆成功', loginRes)
							const {
								code
							} = loginRes
							userLogin({
								code
							}).then(({
								data
							}) => {
								const {
									openid
								} = data;
								console.log(111, data)
								console.log(222, openid)
								//赋值
								_self.userInfos.openid = openid;
								_self.userInfos.session_key = data.session_key;
								//储存信息
								// _self.setLogin(openid)
								// uni.setStorageSync('super_token', openid);
								// _self.setloginStatus(true)
								uni.getUserInfo({
									provider: 'weixin',
									success: function(resdata) {
										//赋值
										_self.userInfos.user_name = resdata.userInfo.nickName
										_self.userInfos.headimgurl = resdata.userInfo.avatarUrl

										resdata.userInfo.openid = data.openid;
										console.log(666, JSON.stringify(resdata.userInfo))
										insertopenids({
											data: JSON.stringify(resdata.userInfo)
										}).then(res3 => {
											console.log(777, res3)
											if (res3.code === 2000) {
												
												//判断用户是否绑定过手机
												getuserinfos({
													openid: _self.userInfos.openid
												}).then(result => {
													console.log(456, result)
													if (result.code === 2000) {
														_self.bindPhoNumSta = result.data.mobile_init
														_self.userInfos.phoneNumber = result.data.mobile
													}
												})
												
												
												
												
												/* if (_self.user === 'user') {
													// 登录成功后跳转的地址
													uni.switchTab({
														url: '/pages/user/index'
													});
												} else {
													// 登录成功后跳转的地址
													uni.navigateTo({
														url: '/pages/index/race_detail?from=index&type=' + _self.type + '&data=' + JSON.stringify(_self.item)
													})
												} */
											}
										})
									}
								})
							})
						},
						fail(e) {
							console.log('errer->', e)
						}
					});
				}
				// #endif










				/* 
				if (res.detail.iv) {
					// store.commit('login',openid); // 如果授权，就将openid 存起来，否则不存
					let info = {};
					const {
						nickName,
						avatarUrl,
						city,
						province,
						country
					} = res.detail.userInfo;
					info.user_name = nickName;
					info.headimgurl = avatarUrl;
					info.city = city;
					info.province = province;
					info.country = country;
					this.setUserInfo({
						user_name: info.user_name,
						province: info.province,
						city: info.city,
						country: info.country,
						headimgurl: info.headimgurl
					});
					uni.setStorageSync('userInfo', info);
					const _self = this;
					// #ifdef MP-WEIXIN
					if (app.is_iOS()) {
						//iOS的方法
						uni.login({
							provider: 'apple',
							success(loginRes) {
								console.log('登陆成功', loginRes)
								const {
									code
								} = loginRes
								console.log(code, res.detail.encryptedData, res.detail.iv)
								userLogin({
									code
								}).then(({
									data
								}) => {
									const {
										openid
									} = data;
									console.log(222111, data)
									console.log(222000, openid)
									_self.setLogin(openid)
									uni.setStorageSync('super_token', openid);
									_self.setloginStatus(true)
									uni.getUserInfo({
										provider: 'apple', //iOS的方法
										success: function(resdata) {
											resdata.userInfo.openid = data.openid;
											console.log(JSON.stringify(resdata.userInfo))
											insertopenids({
												data: JSON.stringify(resdata.userInfo)
											}).then(res3 => {
												console.log(666, res3)
												if (res3.code === 2000) {
													if (_self.user === 'user') {
														// 登录成功后跳转的地址
														uni.switchTab({
															url: '/pages/user/index'
														});
													} else {
														// 登录成功后跳转的地址
														uni.navigateTo({
															url: '/pages/index/race_detail?from=index&type=' + _self.type + '&data=' + JSON.stringify(_self.item)
														})
													}
												}
											})
										}
									})
								})
							},
							fail(e) {
								console.log('errer->', e)
							}
						});
					} else {
						uni.login({
							provider: 'weixin',
							success(loginRes) {
								console.log('登陆成功', loginRes)
								const {
									code
								} = loginRes
								console.log(code, res.detail.encryptedData, res.detail.iv)
								userLogin({
									code
								}).then(({
									data
								}) => {
									const {
										openid
									} = data;
									console.log(222111, data)
									console.log(222000, openid)
									_self.setLogin(openid)
									uni.setStorageSync('super_token', openid);
									_self.setloginStatus(true)
									uni.getUserInfo({
										provider: 'weixin',
										success: function(resdata) {
											resdata.userInfo.openid = data.openid;
											console.log(JSON.stringify(resdata.userInfo))
											insertopenids({
												data: JSON.stringify(resdata.userInfo)
											}).then(res3 => {
												console.log(666, res3)
												if (res3.code === 2000) {
													if (_self.user === 'user') {
														// 登录成功后跳转的地址
														uni.switchTab({
															url: '/pages/user/index'
														});
													} else {
														// 登录成功后跳转的地址
														uni.navigateTo({
															url: '/pages/index/race_detail?from=index&type=' + _self.type + '&data=' + JSON.stringify(_self.item)
														})
													}
												}
											})
										}
									})
								})
							},
							fail(e) {
								console.log('errer->', e)
							}
						});
					}
					// #endif

				}*/

			},
			cancelAuth() {
				store.commit('loginOut')
				uni.switchTab({
					url: '/pages/user/index'
				})
			},
			navTo(type) {
				if (type === '1') {
					uni.navigateTo({
						url: '/pages/signUp/statement1'
					})
				} else {
					uni.navigateTo({
						url: '/pages/signUp/statement2'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.login-box {
		height: calc(100vh);
	}

	.wxbottom {
		flex: 1;
		width: calc(100% - 60rpx);
		margin: 0 30rpx;
	}

	.bg {
		background: #C0C4CC;
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.box-info {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		background-color: #fff;
		border-radius: 0 0 18upx 18upx;
		padding: 60upx 0 40upx 0;

		.info_title {
			font-size: 36upx;
			font-weight: 600;
			color: #000;
			letter-spacing: 2upx;
		}

		.info_desc {
			width: 446upx;
			color: #999;
			font-weight: 500;
			font-size: 28upx;
			line-height: 41upx;
			text-align: center;
			padding: 40upx 0;
		}

		.confirm-btn {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 440upx;
			height: 88upx;
			border-radius: 44upx;
			font-size: 32upx;
			color: #fff;
			margin-bottom: 40upx;
			letter-spacing: 2upx;
		}

		.close-btn {
			font-size: 28upx;
			color: #999;
			letter-spacing: 2upx;
		}
	}

	.new_bg {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 30%;

		.tip_box {
			font-size: 36rpx;
			font-weight: bold;
			color: #333333;
			margin-bottom: 30rpx;
		}

		.content_box {
			margin: 0 30rpx;
			width: calc(100% - 60rpx);
			font-size: 30rpx;
			color: #666666;
			line-height: 60rpx;
			text-align: center;
			margin-bottom: 100rpx;
		}

		.new-confirm-btn {
			width: 690rpx;
			height: 88rpx;
			border-radius: 44rpx;
			font-size: 32rpx;
			color: #FFFFFF;
			margin-bottom: 40rpx;
			background-color: #02BB6F;
			display: none;
		}

		.new-close-btn {
			display: none;
			width: 690rpx;
			height: 88rpx;
			border: 2rpx solid #DEDEDE;
			border-radius: 44rpx;
			font-size: 32rpx;
			color: #999999;
			text-align: center;
			line-height: 88rpx;
			margin-bottom: 30rpx;
		}

		.agree {
			display: flex;
			flex-direction: row;
			margin-bottom: 30rpx;

			.img_box {
				width: 30rpx;
				height: 30rpx;
				margin-right: 9rpx;
				margin-top: 10rpx;
			}

			.text_box {
				text {
					font-size: 24rpx;
				}

				.fontColor-primary {
					color: #ff4d4d;
				}
			}
		}
	}

	.hoverBtn {
		background-color: #cccccc;
	}
</style>
